@charset "utf-8";
/* CSS Document */
* {
  box-sizing: border-box;
}

/* Style the body */
body{
  font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";
  margin: 0;
}

/* Header/logo Title */
.header {
  padding:80px;
  text-align: center;
  color: red;
  font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
}
 .header {
  background: url("images/IMG_0036.JPG");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}


/* Increase the font size of the heading */
.header h1 {
  font-size: 100px;
}
.header {font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif"}

/* Style the top navigation bar */
.navbar {
  overflow: hidden;
  background-color: black;
  
}

/* Style the navigation bar links */
.navbar a {
  float: left;
  display: block;
  color: white;
  text-align: center;
  padding: 14px 20px;
  text-decoration:underline;
	text-decoration-color: red;
	font-size: 25px
	
}

/* Right-aligned link */
.navbar a.right {
  float: right;
}

/* Change color on hover */
.navbar a:hover {
  background-color:white;
	color: black
}

/* Column container */
.row {  
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -ms-flex-wrap: wrap; /* IE10 */
  flex-wrap: wrap;
}

/* Create two unequal columns that sits next to each other */
/* Sidebar/left column */
.side {
  -ms-flex: 30%; /* IE10 */
  flex: 30%;
  background: url("images/tires backround.jpg");
  padding: 20px;
  background-size:cover;
}
.side {color: white;border-style: double; border-color: red;}
.side {float: left}
.side{font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif"}


/* Main column */
.main {   
  -ms-flex: 70%; /* IE10 */
  flex: 70%;
  background-color:black;
  padding: 20px; 
}
.main {color:white}
.main {border-style:double; border-color: red;}
.main {background: url("images/tires backround.jpg");background-size: cover}
.main{font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif"}

/* below main info*/
.below {
	flex: 70%;
	background-color:black;
	padding:20px;
	color: white;
	border-style: double;
	border-color: red;
	background: url("images/tires backround.jpg");
	background-size: cover;

}

/* Footer */
.footer {
  padding: 20px;
  text-align: center;
  background-color: black;
	color: white;
	width: 100%;
}
.footer {font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";}


/* Responsive layout - when the screen is less than 700px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 700px) {
  .row {   
    flex-direction: column;
  }
}

/* Responsive layout - when the screen is less than 400px wide, make the navigation links stack on top of each other instead of next to each other */
@media screen and (max-width: 400px) {
  .navbar a {
    float: none;
    width: 100%;
  }
}
	@media screen and (max-width: 400px) {
  .main a {
    float: none;
    width: 100%;
  }
}
		@media screen and (max-width: 400px) {
  .side a {
    float: none;
    width: 100%;
  }
}
@media screen and (max-width: 400px) {
  .header a {
    float: none;
    width: 100%;
  }
}
@media screen and (max-width: 400px) {
  .footer a {
    float: none;
    width: 100%;
  }
}
@media screen and (max-width: 400px) {
  img {
    float: none;
    width: 100%;
  }
}
	
